<head>
  <meta charset=UTF-8>
</head>
<body>
<div>
  最有趣的人物是<span></span>,
  它的年龄是:<span></span>
</div>
<script type="text/javascript" src="jquery-3.1.1.js">
</script>
<script type="text/javascript">
  var target = $("<div>java</div>");
  //向jQuery对象里添加book数据
  target.data("book" , "疯狂Java讲义");
  //访问jQuery对象里的book数据，将输出“疯狂Java讲义”
  console.log(target.data("book"));
  //删除jQuery对象里的book数据
  target.removeData("book");
  //再次访问jQuery对象里的book数据，将输出"undefined"
  console.log(target.data("book"));
  //获取页面上第一个div元素
  var div = $("body>div")[0];
  //向div元素中存储多个key:value对
  $.data(div, "test", { name: "孙悟空", age: 500 });
  //访问div元素中存储的数据
  $("span:first").text(jQuery.data(div, "test").name);
  $("span:last").text(jQuery.data(div)["test"].age);
  //删除div元素中的数据
  $.removeData(div);
  //判断div元素中是否有数据
  console.log($.hasData(div));
</script>
</body>
